
<template name="skeleton">
  <view class="sk-container">
    <view class="viewport">
      <scroll-view class="scroll-view"  refresher-enabled="true" scroll-y="true">
        <view>
          <swiper autoplay="false" circular="true" class="banner Banner--banner" duration="1000" indicator-active-color="#27ba9b" indicator-dots="true" interval="3000" current="0">
            <swiper-item style="position: absolute; width: 100%; height: 100%; transform: translate(0%, 0px) translateZ(0px);">
              <image class="image Banner--image _img Banner--_img sk-image" mode="widthFix" style="height: 151.21px;"></image>
            </swiper-item>
          </swiper>
        </view>
        <view>
          <view class="category Category--category">
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-905 sk-text">居家</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-572 sk-text">锦鲤</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-101 sk-text">服饰</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-978 sk-text">母婴</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-245 sk-text">个护</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-263 sk-text">严选</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-142 sk-text">数码</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-876 sk-text">运动</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-25 sk-text">杂项</text>
            </navigator>
            <navigator class="category-item Category--category-item" hover-class="none">
              <image class="icon Category--icon sk-image"></image>
              <text class="text Category--text sk-transparent sk-text-14-2857-147 sk-text">品牌</text>
            </navigator>
          </view>
        </view>
        <view>
          <view class="panel HotPanel--panel hot HotPanel--hot">
            <view class="item HotPanel--item">
              <view class="title HotPanel--title">
                <text class="title-text HotPanel--title-text sk-transparent sk-text-14-2857-412 sk-text">特惠推荐</text>
                <text class="title-desc HotPanel--title-desc sk-transparent sk-text-14-2857-314 sk-text">它们最实惠</text>
              </view>
              <navigator class="cards HotPanel--cards" hover-class="none">
                <image class="image HotPanel--image sk-image" mode="aspectFit"></image>
                <image class="image HotPanel--image sk-image" mode="aspectFit"></image>
              </navigator>
            </view>
            <view class="item HotPanel--item">
              <view class="title HotPanel--title">
                <text class="title-text HotPanel--title-text sk-transparent sk-text-14-2857-306 sk-text">爆款推荐</text>
                <text class="title-desc HotPanel--title-desc sk-transparent sk-text-14-2857-405 sk-text">它们最受欢迎</text>
              </view>
              <navigator class="cards HotPanel--cards" hover-class="none">
                <image class="image HotPanel--image sk-image" mode="aspectFit"></image>
                <image class="image HotPanel--image sk-image" mode="aspectFit"></image>
              </navigator>
            </view>
            <view class="item HotPanel--item">
              <view class="title HotPanel--title">
                <text class="title-text HotPanel--title-text sk-transparent sk-text-14-2857-323 sk-text">一站买全</text>
                <text class="title-desc HotPanel--title-desc sk-transparent sk-text-14-2857-180 sk-text">使用场景下精心优选</text>
              </view>
            </view>
            <view class="item HotPanel--item">
              <view class="title HotPanel--title">
                <text class="title-text HotPanel--title-text sk-transparent sk-text-14-2857-581 sk-text">领券中心</text>
                <text class="title-desc HotPanel--title-desc sk-transparent sk-text-14-2857-612 sk-text">更多超值优惠券</text>
              </view>
            </view>
          </view>
        </view>
      </scroll-view>
    </view>
  </view>
</template>

<style>
	.sk-transparent {
		color: transparent !important;
	}

	.sk-text-3-5714-852 {
		background-image: linear-gradient(transparent 3.5714%, #EEEEEE 0%, #EEEEEE 96.4286%, transparent 0%) !important;
		background-size: 100% 28.0000rpx;
		position: relative !important;
	}

	.sk-text {
		background-origin: content-box !important;
		background-clip: content-box !important;
		background-color: transparent !important;
		color: transparent !important;
		background-repeat: repeat-y !important;
	}

	.sk-text-14-2857-70 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 39.2000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-905 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-572 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-101 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-978 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-245 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-263 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-142 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-876 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-25 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-147 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 36.4000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-412 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 44.8000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-314 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 33.6000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-306 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 44.8000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-405 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 33.6000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-323 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 44.8000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-180 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 33.6000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-581 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 44.8000rpx;
		position: relative !important;
	}

	.sk-text-14-2857-612 {
		background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
		background-size: 100% 33.6000rpx;
		position: relative !important;
	}

	.sk-image {
		background: #EFEFEF !important;
	}

	.sk-container {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		background-color: transparent;
	}
</style>